@charset "UTF-8";



/* 基本スタイル
---------------------------------------------*/
body {
        margin: 0;
        padding: 0;
        font-size: 75%;
        font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", sans-serif;
        line-height: 1.4;
        color: #333333;
        background: #FFFFFF;
}

/* ヘッダー
---------------------------------------------*/
#leftCanvas{
        position: absolute;
        margin: 50px 0px 0px 10px;
	padding : 20px 10px 0px 10px;
	width : 180px;
	height : 600px;
        background: #F8F8FF;
        border-width: 1px 1px 1px 1px; /* 枠の幅 */
        border-style: solid; /* 枠の種類 */
        border-color: #9999ff; /* 枠の色 */
}

#mainCanvas{
        position: absolute;
        margin: 50px 0px 0px 220px;
        border-width: 1px 1px 1px 1px; /* 枠の幅 */
        border-style: solid; /* 枠の種類 */
        border-color: #9999ff; /* 枠の色 */
}
#header {
        position: relative;
        width: 700px;
        height: 170px;
        background: #FFFFFF;

}

#title {
        position: absolute;
        top : 40px;
        left: 25px;
        width: 600px;
        height: 30px;
        font-size: 200%;
	padding-left : 10px;
        background : #FFFFFF;
        border-width: 0px 0px 2px 15px; /* 枠の幅 */
        border-style: solid; /* 枠の種類 */
        border-color: #9999ff; /* 枠の色 */
}

#mode{
        position: absolute;
        top : 100px;
        left : 500px;
        width: 100px;
        height: 59px;
        background: #F8F8FF;
        border-width: 1px 1px 1px 1px; /* 枠の幅 */
        border-style: solid; /* 枠の種類 */
        border-color: #9999ff; /* 枠の色 */
}
#langmode{
        position: absolute;
        top : 100px;
        left : 25px;
        width: 451px;
        height: 59px;
        background: #FFFFFF;
}

        .lavaLampWithImage {
            position: relative;
            height: 29px;
            width: 421px;
            background: url("image/bg.gif") no-repeat top;
            padding: 15px;
            margin: 0px 0;
            overflow: hidden;
        }
                .lavaLampWithImage li {
                    float: left;
                    list-style: none;
                }
                    .lavaLampWithImage li.back {
                        background: url("image/lava.gif") no-repeat right -30px;
                        width: 9px; height: 30px;
                        z-index: 8;
                        position: absolute;
                    }
                        .lavaLampWithImage li.back .left {
                            background: url("image/lava.gif") no-repeat top left;
                            height: 30px;
                            margin-right: 9px; /* 7px is the width of the rounded shape */
                        }
                    .lavaLampWithImage li a {
                        font: bold 14px arial;
                        text-decoration: none;
                        color: #fff;
                        outline: none;
                        text-align: center;
                        top: 7px;
                        text-transform: uppercase;
                        letter-spacing: 0;
                        z-index: 10;
                        display: block;
                        float: left;
                        height: 30px;
                        position: relative;
                        overflow: hidden;
                        margin: auto 10px;    
                    }
                        .lavaLampWithImage li a:hover, .lavaLampWithImage li a:active, .lavaLampWithImage li a:visited {
                            border: none;
                        }

        .lavaLampNoImage {
            position: relative;
            height: 29px;
            width: 421px;
            background-color: white;
            padding: 15px;
            margin: 10px 0;
            overflow: hidden;
            border: 1px solid gray;
        }
                .lavaLampNoImage li {
                    float: left;
                    list-style: none;
                }
                    .lavaLampNoImage li.back {
                        border: 1px solid #000;
                        background-color: #e6e8ea;
                        width: 9px;
                        height: 30px;
                        z-index: 8;
                        position: absolute;
                    }
                    .lavaLampNoImage li a {
                        font: bold 14px arial;
                        text-decoration: none;
                        color: #000;
                        outline: none;
                        text-align: center;
                        top: 7px;
                        text-transform: uppercase;
                        letter-spacing: 0;
                        z-index: 10;
                        display: block;
                        float: left;
                        height: 30px;
                        position: relative;
                        overflow: hidden;
                        margin: auto 10px;
                    }
                        .lavaLampNoImage li a:hover, .lavaLampNoImage li a:active, .lavaLampNoImage li a:visited {
                            border: none;
                        }                    

        .lavaLampBottomStyle {
            position: relative;
            height: 29px;
            width: 421px;
            background-color: white;
            padding: 15px;
            margin: 10px 0;
            overflow: hidden;
            border: 1px solid gray;
        }
                .lavaLampBottomStyle li {
                    float: left;
                    list-style: none;
                }
                    .lavaLampBottomStyle li.back {
                        border-bottom: 5px solid blue;
                        width: 9px;
                        height: 30px;
                        z-index: 8;
                        position: absolute;
                    }
                    .lavaLampBottomStyle li a {
                        font: bold 14px arial;
                        text-decoration: none;
                        color: #000;
                        outline: none;
                        text-align: center;
                        top: 7px;
                        text-transform: uppercase;
                        letter-spacing: 0;
                        z-index: 10;
                        display: block;
                        float: left;
                        height: 30px;
                        position: relative;
                        overflow: hidden;
                        margin: auto 10px;
                    }   
                        .lavaLampBottomStyle li a:hover, .lavaLampBottomStyle li a:active, .lavaLampBottomStyle li a:visited {
                            border: none;
                        }                     

/* 2段組
---------------------------------------------*/
#contents {
        position: relative;
        width: 700px;
        height: 480px;
        background: #FFFFFF;
}

#meanbox {
	position : absolute ;
	visibility : hidden;
        border-width: 1px 1px 1px 1px; /* 枠の幅 */
        border-style: solid; /* 枠の種類 */
        border-color: #9999ff; /* 枠の色 */
        background-color: #FFFFFF;
	width:200px;
}


#description {
        position: absolute;
        font-size: 120%;
        width: 600px;
        height : 400px;
        left: 25px;
        top: 10px;
        background-color: #F8F8FF;
	padding : 20px;
        border-width: 1px 1px 1px 1px; /* 枠の幅 */
        border-style: solid; /* 枠の種類 */
        border-color: #9999ff; /* 枠の色 */
	overflow : auto;
}

#description .ui-selecting { background: #FECA40; }
#description .ui-selected { background: #FECA40; }

/*
------------------------------------------------*/

.wordbox{
	position: relative;
	float:left;
display:inline;
	margin : 0px 5px 80px 0px;
	padding: 2px;

	font-weight: bold;
	color: #000;
}

.word{
	background-color: #DDDDFF;
}

.signbox{
	position: relative;
	float:left;
display:inline;
	margin : 0px 5px 80px 0px;
	font-weight: bold;
	color: #000;
}

/*
.sentence {
	position: relative;

        width: 500px;
	margin : 0px 0px 80px 0px;
	background-color: #FF0000;
        border-width: 1px 1px 1px 1px; 
        border-style: solid; 
        border-color: #9999ff; 
}
*/

#waku{
	position: relative;
	clear: left;
        width: 600px;
	height : 2px;
	margin : 10px 0px;
	background-color: #0000FF;
}




